<template>
	<view class="page">

		<view
			style="margin-bottom: 25rpx ;height: auto; box-shadow: 0 10rpx 25rpx 0 #b4b4b4;border-radius: 0 0 15rpx 15rpx;">

			<view style="padding: 20rpx;">
				<u--text :size="22" :bold="true" :text="detail.theme"></u--text>
			</view>

			<u-row customStyle="margin: 20rpx">
				<u-col span="2">
					<u--text prefixIcon="account" iconStyle="font-size: 19px" text="局长:"></u--text>
				</u-col>
				<u-col span="2">
					<u-avatar @click="gotoMember(detail.leader.nid)" size="30"
						:src="detail.leader.headimgurl"></u-avatar>
				</u-col>
				<u-col span="4">
					<u--text prefixIcon="clock" iconStyle="font-size: 19px" :text="'感兴趣:'+detail.interested "></u--text>
				</u-col>
				<u-col span="4">
					<u--text prefixIcon="eye" iconStyle="font-size: 19px" :text="'浏览:'+detail.view"></u--text>
				</u-col>
			</u-row>

			<view style="margin: 40rpx;">
				<u--text v-if="detail.over_content" :text="detail.over_content"></u--text>
				<u-gap height="10"></u-gap>
				<u-album multipleSize="100" :urls="detail.file_list"></u-album>
			</view>
			<view class="text" v-if="detail.content">
				<u-parse :content="detail.content"></u-parse>
			</view>
			<u-line></u-line>

			<u-cell :border="false" :customStyle="{'font-size': '32px'}" title="组局趣友"></u-cell>
			<view>
				<u-cell v-for="(item,index) in detail.member_list" :key="index">

					<u-avatar @click="gotoMember(item.nid)" slot="icon" shape="circle" size="35" :src="item.headimgurl"
						customStyle="margin: -3px 5px -3px 0"></u-avatar>

					<view slot="title" class="u-slot-title">
						<view style="display: flex;">
							<view class="tag-item" v-for="(tag_item,tag_index) in item.tag_list" :key="tag_index">
								<u-tag @click="gotoMember(item.nid)" :text="tag_item.tag" plain size="mini"
									:type="tag_item.type">
								</u-tag>
								<u-badge max="99" :value="tag_item.num" :absolute="true" :offset="[-10,-10]"></u-badge>
							</view>
						</view>
					</view>

					<view slot="value">
						<u--text @click="like(index)" prefixIcon="thumb-up-fill"
							:iconStyle="item.is_like ? 'font-size: 26px;color: #ffd91d' : 'font-size: 26px;'"
							:text="item.like_num"></u--text>
					</view>

				</u-cell>
			</view>

		</view>

		<comment-eg :articleId="id"></comment-eg>
 
	</view>
</template>
  
<script>
	import * as EventApi from '@/api/event.js'
	import * as LikeApi from '@/api/like.js'
	export default {

		data() {

			return {
				detail: {
					file_list: []
				},
				id: 0
			}
		},
		onLoad(e) {
			this.id = e.id
		},
		onShow() {
			this.getDetail()
		},
		/*分享当前页面*/
		onShareAppMessage() {
			return {
				title: this.detail.theme,
				imageUrl: this.detail.image1
			}
		},
		onShareTimeline() {
			return {
				title: this.detail.theme,
				imageUrl: this.detail.image1
			}
		},
		methods: {
			getDetail() {
				let that = this;
				EventApi.event_over_detail({
					event_nid: this.id
				}).then(res => {
					that.detail = res.info
				})
			},

			like(index) {
				let member = this.detail.member_list[index];
				LikeApi.like({
					member_nid: member.nid,
					event_nid: this.id
				}).then(res => {
					if (res.status == 200) {
						member.is_like = res.data
						if (member.is_like) {
							member.like_num++
						} else {
							member.like_num--
						}
					} else {
						uni.$u.toast(res.info)
					}

				})
			},

			gotoMember(member_nid) {
				uni.navigateTo({
					url: '/pages/director/index?member_nid=' + member_nid
				});
			},
		}
	}
</script>

<style scoped lang="scss">
	.page {
		background-color: #fff;
		padding-top: 0;

		.avatar-list {
			display: flex;
			flex-wrap: wrap;
		}

		.tag-item {
			margin: 10rpx;
			position: relative;
			display: flex;
		}

		.piece {
			background: #ffd91d;
			border-radius: 15rpx;
			height: 100rpx;
			width: 610rpx;
			margin: 50rpx 0;
			padding: 50rpx;
		}
	}
</style>